<%@ page import="com.fasterxml.jackson.databind.ObjectMapper" %>
<%@ page import="com.joinsoft.framework.web.StringJspWriter" %>
<%@ page import="com.joinsoft.framework.web.json.JsonDialog" %>
<%@ page import="com.joinsoft.framework.web.json.JsonObject" %>
<%@ page import="java.io.File" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@include file="/WEB-INF/include/taglib.jsp" %>
<%
    out = new StringJspWriter();
    pageContext.pushBody(out);
%>
<c:set var="file_separator" value="<%=File.separator%>"/>
<%--<script src="${ctxRoot}/static/js/jquery-ui-1.10.3.min.js"></script>--%>
<script src="${ctxRoot}/static/framework/jquery-ztree/js/jquery.ztree.all-3.5.min.js"></script>

<script src="${ctxRoot}/static/js/jquery-ui-1.10.3.min.js"></script>
<script>
    $(document).ready(function(){

        $("#modalDialog").draggable();//为模态对话框添加拖拽
        $("#myModal").css("overflow", "hidden");//禁止模态对话框的半透明背景滚动

    })
    function modalMax() {
        $(".modal-dialog").css({width: "100%", height: "100%", margin: "0"});
        $(".modal-content").css({width: "100%", height: "100%", margin: "0"});
        $("#fromToPath").show();
        $("#modal-footer").show();
        $("#modalMax").hide();
        $("#modalBack").show();
    }
    function modalMin() {
        $(".modal-dialog").css({width: "250px", height: "30px", margin: "0"});
        $(".modal-content").css({width: "250px", height: "35px", margin: "0"});
        $("#fromToPath").hide();
        $("#modalMin").hide();
        $("#modalBack").show();
        $("#modal-footer").hide();
    }
    function modalBack() {
        $(".modal-dialog").css({width: "400px", height: "auto", margin: "0"});
        $(".modal-content").css({width: "100%", height: "auto", margin: "0"});
        $("#fromToPath").show();
        $("#modalMax").show();
        $("#modalMin").show();
        $("#modalBack").hide();
        $("#modal-footer").show();
    }
</script>

<link rel="stylesheet" type="text/css"
      href="${ctxRoot}/static/framework/jquery-ztree/css/zTreeStyle/zTreeStyle.css"/>
<div class="modal fade" id="myModal">
    <div id="modalDialog" class="modal-dialog" style="width: 400px">
        <div class="modal-content" style="width: 400px">
            <%--<div class="modal-header center">--%>
                <%--<h4>--%>
                    <%--<c:if test="${action eq 'copy'}">复制到</c:if>--%>
                    <%--<c:if test="${action eq 'move'}">移动到</c:if>--%>
                <%--</h4>--%>
            <%--</div>--%>


                <table border="0" cellpadding="0" cellspacing="0" width="100%">
                    <tr>
                        <td align="left" style="font-size: 14px;padding-left: 10px;" class="layui-layer-title">
                            <c:if test="${action eq 'copy'}">复制到</c:if>
                            <c:if test="${action eq 'move'}">移动到</c:if>
                        </td>
                        <td align="right" style="font-size: 12px;padding-right: 10px;" class="layui-layer-title">
                            <span class="layui-layer-setwin">

                                <a id="modalMin" onclick="modalMin()" class="layui-layer-min"
                                   href="javascript:;"><cite></cite></a>
                                <a id="modalBack" onclick="modalBack()" style="display:none;"
                                   class="layui-layer-ico layui-layer-max layui-layer-maxmin" href="javascript:;"></a>
                                <a id="modalMax" onclick="modalMax()" class="layui-layer-ico layui-layer-max"
                                   href="javascript:;"></a>
                                <a id="modalClose" class="layui-layer-ico layui-layer-close layui-layer-close1"
                                   data-dismiss="modal" href="javascript:;"></a>
                            </span>
                        </td>
                    </tr>
                </table>

            <div class="modal-body">
                <form id="fromToPath" action="${ctx}/resource/directory_tree.do" class="directory_tree">
                    <input name="action" value="${action}" type="hidden"/>
                    <c:forEach items="${paths}" var="path">
                        <input name="path" value="${path}" type="hidden"/>
                    </c:forEach>
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="widget-box widget-color-blue2">
                                <div class="widget-header">
                                    <h4 class="widget-title lighter smaller">请选择目录</h4>
                                </div>
                            </div>

                            <div style="max-height: 300px; overflow-y: auto; overflow-x: auto;">
                                <ul id="dir_ztree" class="ztree"></ul>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div id="modal-footer" class="modal-footer">
                <button id="bcm" class="btn btn-primary btn-sm " data-dismiss="modal">
                    <i class="ace-icon glyphicon glyphicon-ok"></i>
                    确定
                </button>
                <button class="btn btn-sm btn-cancel" data-dismiss="modal">
                    <i class="ace-icon glyphicon glyphicon-remove"></i>
                    取消
                </button>

            </div>
        </div>
    </div>
    <script type="text/javascript">
        jQuery(document).ready(function () {
            //TODO 初始化树
            $.ajax({
                url: "${ctx}/resource/directory_content.do?path=/",
                cache: false,
                type: "GET",
                dataType: "json",
                success: function (data) {
                    var directorySubFiles = data['data'];
                    var directories = directorySubFiles['directories'];
                    treeConstruct(directories); //TODO
                }
            });

            jQuery("#bcm").click(function() {
                var treeObj = $.fn.zTree.getZTreeObj("dir_ztree");
                var nodes = treeObj.getCheckedNodes(true);
                var destination = {"name": "destination", "value": nodes[0]["path"]};
                var param = $("#fromToPath").serializeArray();
                param.push(destination);
                $.ajax({
                    url: "${ctx}/resource/copy_move.do",
                    cache: false,
                    async: false,
                    type: "POST",
                    data: param,
                    dataType: "json",
                    success: X.json
                });
            });
        });

        //把json数据转成树
        function treeConstruct(json) {
            var zTreeObj;
            var setting = {
                check: {
                    enable: true,
                    chkStyle: "radio"
                },
                async: {
                    enable: true,
                    url: "${ctx}/resource/directory_content.do",
                    autoParam: ["path"],
                    dataFilter: ajaxDataFilter
                },
                data: {
                    simpleData: {
                        enable: true
                    }
                }
            };
            var zNodes = [];
            var rootNode = {name: "根目录", path: "\\", isParent: true, id: 0, pId: null, open: true};
            zNodes.push(rootNode);
            $(json).each(function (index, treeNode) {
                var zNode = getSimpleDataNode(treeNode, 0);
                zNodes.push(zNode);
            });
            zTreeObj = $.fn.zTree.init($("#dir_ztree"), setting, zNodes);
        }
        function getSimpleDataNode(data, pId) {
            //必须传入json对象
            var path = data['path'];
            var fileName = data['fileName'];
            return {
                pId: pId,
                name: fileName,
                path: path,
                isParent: true
            }
        }
        function ajaxDataFilter(treeId, parentNode, data) {
            if (data) {
                var directorySubFiles = data['data'];
                var directories = directorySubFiles['directories'];
                var zNodes = [];
                $(directories).each(function (index, treeNode) {
                    var zNode = getSimpleDataNode(treeNode, parentNode.id);
                    zNodes.push(zNode);
                });
                return zNodes;
            }
        }
    </script>
</div>

<%
    response.setHeader("Content-Type", "text/plain");
    JsonDialog dialog = new JsonDialog();
    dialog.setHtml(out.toString());
    JsonObject<JsonDialog> json = JsonObject.dialog(dialog);
    ObjectMapper mapper = new ObjectMapper();
    mapper.writeValue(response.getWriter(), json);
%>
